<template>
	<view class="container">
		<uni-popup ref="popup" type="top" background-color="#fff">
			<view class="popup-content">
				<uni-forms ref="queryForm" :modelValue="queryParams">
					<uni-forms-item label="案件简称" label-width="85">
						<uni-easyinput v-model="assignedCaseName" placeholder="案件简称"></uni-easyinput>
					</uni-forms-item>
					<uni-forms-item label="交办时间" label-width="85">
						<uni-datetime-picker v-model="queryParams.reportTime" type="daterange"/>
					</uni-forms-item>
				</uni-forms>
				<view style="display: flex;">
					<button size="mini" class="common-btn other-btn" @click="handleRepeat">重置</button>
					<button size="mini" class="common-btn primary-btn" @click="handleQuery">查询</button>
				</view>
			</view>
		</uni-popup>
		<view class="uni-list">
			<case-list-content :list-data="listData" :rows="rows">
				<template #status="item">
					<view class="list-row" >
						<view class="list-row-label">状态</view>
						<view class="list-row-content" :class="{'red-text':!item.data.disposeTime}">{{item.data.disposeTime?"已处理":"待处理"}}</view>
					</view>
				</template>
				<template #btns="item">
					<button class="common-btn other-btn"  size="mini" @click="itemClick(item.data,'view')">查看详情</button>
					<button v-if="type == 'deal' && !item.data.disposeTime" class="common-btn primary-btn"  size="mini" @click="itemClick(item.data,'deal')">处理</button>
				</template>
			</case-list-content>
		</view>
		<uni-load-more :status="status" :icon-size="16" :content-text="contentText" />
	</view>
</template>

<script>
	import { getCaseAssignedList } from '@/api/dums/caw/caseAssigned.js'
	export default {
		data() {
			return {
				page:1,
				size:10,
				total:0,
				listData: [],
				queryParams:{},
				assignedCaseName:"",
				//列表显示字段
				rows:[{
					labelName:"案件简称",
					valueName:"assignedCaseName"
				},{
					labelName:"交办时间",
					valueName:"assignedTime"
				},{
					labelName:"位置描述",
					valueName:"address"
				},{
					labelName:"状态",
					valueName:"status",
					isSlot:true
				}],
				reload: false,
				status: 'more',
				contentText: {
					contentdown: '上拉加载更多',
					contentrefresh: '加载中',
					contentnomore: '没有更多'
				},
				type:""//"deal"为处理列表 过滤条件增加userId
			}
		},
		onLoad(options) {
			this.type = options.type;
			if(this.type && this.type == "deal"){
				this.queryParams.disposeUserId = this.$store.state.user.userInfo.id;
			}else{
				//只展示领导自己提交的交办
				this.queryParams.assignedUserId = this.$store.state.user.userInfo.id;
			}
			
			this.page = 1;
			this.reload = true;
			this.listData = [];
			this.getList();
		},
		methods: {
			getList(){
				uni.showLoading({
					title:"加载中"
				})
				if (this.total && !this.reload) {
					//说明已有数据，目前处于上拉加载
					this.status = 'loading';
				}
				if(this.reload){
					uni.stopPullDownRefresh();
				}
				if(this.assignedCaseName){
					this.queryParams.assignedCaseName = this.assignedCaseName;
				}
				this.queryParams.pageSize = this.size;
				this.queryParams.pageNum = this.page;
				console.log(JSON.stringify(this.queryParams));
				getCaseAssignedList(this.queryParams).then(res => {
					console.log(JSON.stringify(res));
					uni.hideLoading();
					if(res.code == 200){
						let list = res.rows;
						this.total = res.total;
						this.listData = this.reload ? list : this.listData.concat(list);
						this.reload = false;
					} 
				})
			},
			itemClick(e,type){
				this.$tab.navigateTo("case-assign-add/case-assign-add?mainId="+e.id+"&type="+type)
			},
			handleQuery(){
				if(this.queryParams.reportTime &&　this.queryParams.reportTime.length>0){
					let params = {
						"rptTimeStart":this.queryParams.reportTime[0]+" 00:00:00",
						"rptTimeEnd":this.queryParams.reportTime[1]+" 23:59:59"
					}
					this.queryParams.params = params;
				}
				this.page = 1;
				this.reload = true;
				this.listData = [];
				this.getList();
				this.$refs.popup.close()
			},
			handleRepeat(){
				this.assignedCaseName = null;
				this.queryParams = {};
			},
		},
		onNavigationBarButtonTap : function (e) {
			if(e.index == 0){
				this.$tab.navigateTo("case-assign-add/case-assign-add");
			}else{
				this.$refs.popup.open()
			}
			
		},
		onPullDownRefresh(){
			this.page = 1;
			this.reload = true;
			this.listData = [];
			this.getList();
		},
		onReachBottom(){
			this.page++;
			if(this.listData.length < this.total){
				this.status = 'more';
			}else{
				this.status = 'noMore';
				return;
			}
			this.getList();
		}
	}
</script>

<style>
	.popup-content {
		padding: 15px;
		height: 500px;
		background-color: #fff;
	}
	.nav-btn{
		margin-right: 15px;
	}
	.list-row{
		display: flex;
		padding-bottom: 10px;
	}
	.list-row-label{
		font-family: MicrosoftYaHei;
		font-size: 14px;
		font-weight: normal;
		line-height: 17px;
		letter-spacing: 0px;
		color: #9DA0AA;
		width: 25%;
	}
	.list-row-content{
		font-family: MicrosoftYaHei;
		font-size: 14px;
		font-weight: normal;
		line-height: 17px;
		letter-spacing: 0px;
		width: 75%;
		color: #353B50;
		white-space:nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}
	.red-text{
		color: red;
	}
	.other-btn{
		margin-right: 10px;
	}
</style>
